{{ define "main" }}
<article class="row">
    <div class="col-lg-8 mx-auto">
        <h1 class="mb-3">{{ .Title }}</h1>
        <div class="text-muted mb-4">{{ .Date.Format "2006-01-02" }} · 阅读时间 {{ .ReadingTime }} 分钟</div>
        
        {{ $freeCount := .Site.Params.freeArticles }}
        {{ $articleIndex := 0 }}
        {{ range where .Site.RegularPages "Type" "posts" }}
            {{ if eq .Permalink $.Permalink }}
                {{ if ge $articleIndex $freeCount }}
                    <div class="paywall text-center">
                        <h5>🔒 付费专栏</h5>
                        <p>您已阅读完 {{ $freeCount }} 篇免费文章</p>
                        <button id="payBtn" class="btn btn-primary">订阅解锁全文（¥365/年）</button>
                    </div>
                    <div id="article-body" style="display:none;">
                        {{ .Content }}
                    </div>
                {{ else }}
                    <div id="article-body">
                        {{ .Content }}
                    </div>
                {{ end }}
            {{ end }}
            {{ $articleIndex = add $articleIndex 1 }}
        {{ end }}
    </div>
</article>
{{ end }}

{{ define "scripts" }}
<script src="https://js.stripe.com/v3/"></script>
<script>
const stripe = Stripe('{{ .Site.Params.stripePublishableKey }}');
document.getElementById('payBtn').addEventListener('click', async () => {
    const {error} = await stripe.redirectToCheckout({
        lineItems: [{price: 'price_1YOUR_PRICE_ID', quantity: 1}],
        mode: 'subscription',
        successUrl: window.location.href + '?paid=1',
        cancelUrl: window.location.href
    });
});
// 简单解锁逻辑（实际应校验后端）
const urlParams = new URLSearchParams(window.location.search);
if (urlParams.get('paid') === '1') {
    document.getElementById('article-body').style.display = 'block';
    document.querySelector('.paywall').style.display = 'none';
}
</script>
{{ end }}